<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>

<body>
  <div id="blue">蓝球：<span id="blue_show"></span></div>
  <div id="red">红球：<span id="red_show"></span></div>
  <button id="btn">机选</button>
  <script>

    //红球  1-33 之间  6个
    // 点击按钮
    var btn = document.getElementById("btn");
    // 篮球的显示的span
    var blue_show = document.getElementById("blue_show")
    // 红球的显示span
    var red_show = document.getElementById("red_show")
    btn.onclick = function () {
      var blueNum = Math.floor(Math.random() * 16 + 1)  //1--16 //篮球 1-16       1个
      // 蓝色球显示
      blue_show.innerHTML = blueNum;
      var redSelectArr = []; //存储1-33之间数字的数组
      for (var j = 1; j <= 33; j++) {
        redSelectArr.push(j)
      }
      console.log(redSelectArr) //[1,2,3,4,5,7,8,9,10,11,12,13,14,15...]

      var redarr = []; //存储红色球
      for (var i = 0; i < 6; i++) {
        var num = Math.floor(Math.random() * redSelectArr.length);//随机下标 从1-33之间的数组删除一个
        var redNum = redSelectArr.splice(num, 1) //用随机生成的下标去红球数组删除回来一个
        redarr.push(redNum) //将红色球存放到数组
      }
      red_show.innerHTML = redarr; //显示红球数组
    }
  </script>
</body>

</html>